<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <style>
    .cvs{border:solid 1px black;}  
  </style>
</head>
<body>
  <canvas class="cvs"></canvas>
</body>
<script>

  const cvs = document.querySelector(".cvs");
  cvs.width = cvs.height = 400;

  const c2d = cvs.getContext("2d");

  // c2d.moveTo(100, 200);
  // c2d.quadraticCurveTo(150, 20, 380, 200);
  // c2d.stroke();

  // c2d.beginPath();
  // c2d.moveTo(100, 200);
  // c2d.lineTo(150, 20);
  // c2d.lineTo(380, 200);
  // c2d.stroke();

  // c2d.moveTo(100, 200);
  // c2d.bezierCurveTo(50, 100, 150, 100, 330, 200)
  // c2d.stroke();

  // c2d.beginPath();
  // c2d.moveTo(100, 200);
  // c2d.lineTo(50, 100);
  // c2d.lineTo(150, 100);
  // c2d.lineTo(330, 200);
  // c2d.stroke();


</script>
</html>